<template>
  <div class="shopMessage">
    <div class="shopMessage_upper" bindtap="jumpDeatil">
      <div>
        <img :src='shopMessage.logo' style="width:85px;height:27px;border-radius:8px;"/>
      </div>
<!--      <span class="shopMessage_upper_name">福小天拍拍优品家电专营店</span>-->
      <span class="shopMessage_upper_name">{{shopMessage.name}}</span>
      <span class="iconfont icon-arrow icon"></span>
    </div>
<!--    <div class="shopMessage_middle">-->
<!--      <div class="shopMessage_middle_coupons">-->
<!--        <span> 卷满99减10元</span>-->
<!--        <span class="iconfont icon-arrow icon1"></span>-->
<!--      </div>-->
<!--      <div class="shopMessage_middle_coupons">-->
<!--        <span> 卷满99减10元</span>-->
<!--        <span class="iconfont icon-arrow icon1"></span>-->
<!--      </div>-->
<!--    </div>-->
<!--    <div class="shopMessage_middle2">-->
<!--      <div class="shopMessage_middle2_item">-->
<!--        <span class="item_num">5.2万</span>-->
<!--        <span class="item_name">关注人数</span>-->
<!--      </div>-->
<!--      <div class="shopMessage_middle2_item">-->
<!--        <span class="item_num">385</span>-->
<!--        <span class="item_name">全部商品</span>-->
<!--      </div>-->
<!--    </div>-->

    <div class="shopMessage_bottom">
      <div class="shopMessage_bottom_wrap">
        <div class="shopMessage_bottom_item">
          <div class="item-image">
            <img src="shop3.png">
          </div>
          <div class="item_title">联系客服</div>
        </div>
        <div class="shopMessage_bottom_item">
          <div class="item-image">
            <img src="shop3.png">
          </div>
          <div class="item_title">进店逛逛</div>
        </div>
      </div>
    </div>

  </div>

</template>

<script>
import { mapGetters } from 'vuex'
import {list,shop} from '@/api/product'
import utils from '../../../../utils/utils'
export default {
  name: 'shopDetail',
  data(){
    return{
      concise:true,
      products:[],
      pageSize: 2,
      pageNum: 1,
      tagIds: [],
      shopMessage:{}
    }
  },
  computed: {
    ...mapGetters([
      'mchId'
    ])
  },
  props:[
    'content'
  ],
  created() {
    this.loadProduct();
  },
  methods:{

    loadProduct(){

      var _this = this
      if (!utils.isNull(this.content.tagids)) {
        this.tagIds = this.content.tagids.split(',');
        for (var i = 0; i < _this.tagIds.length; i++) {
          _this.tagIds[i] = parseInt(_this.tagIds[i])
        }
      }
      let params=new URLSearchParams()
      params.append('mchId', this.mchId);
      for (var i = 0; i < this.tagIds.length; i++) {
        params.append('tagIds',this.tagIds[i])
      }
      params.append('pageSize',10)
      // params
      shop().then(res=>{
        this.shopMessage = res.data[0]
        console.log(this.shopMessage,"shopMessageshopMessageshopMessageshopMessage")
      })
    },
  }
}
</script>

<style scoped>
.shopMessage {
  padding: 0 20px;
  background-color: #fff;
  border-radius: 3px;
}
.shopMessage_upper {
  padding-top: 20px;
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.shopMessage_upper_name{
  font-size: 16px;
  font-weight: 600;
}
.shopMessage_middle{
  padding-top: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  /*justify-content: start;*/
}
.shopMessage_middle_coupons{
  margin: 0 15px 15px 0;
  border-radius: 8px;
  display: flex;
  align-items: center;
  background-color:#fcecec;
}

.shopMessage_middle_coupons > span{
  padding: 5px;
  font-size:10px;
}
.shopMessage_middle2{
  display: flex;
}
.shopMessage_middle2_item{
  display: flex;
  flex-direction: column;
  width: 100px;
}
.shopMessage_middle2_item > span{
  padding: 12px 0;
  span-align: center;
}
.shopMessage_middle2_item .item_num{
  font-weight: 600;
  font-size:15px;
}
.shopMessage_middle2_item .item_name{
  padding: 0;
  font-size:10px;
}
.shopMessage_bottom{
  display: flex;
  justify-content: center;
  padding: 25px 0;
}
.shopMessage_bottom_wrap{
  display: flex;
  justify-content: space-between;
  width:250px;
}
.shopMessage_bottom_item{
  display: flex;
  align-items: center;
  justify-content: center;
  width:114px;
  height: 32px;
  border-radius: 25px;
  border: 1px solid #cecece;
}
.shopMessage_bottom_item .item-image{
  display: flex;
  align-items: center;
}
.shopMessage_bottom_item img{
  width: 15px;
  height: 15px;
}
.shopMessage_bottom_item > .item_title{
  padding-left: 10px;
  font-size:15px;
}

.icon-arrow:before {
  content: "\e61f";
}
.icon {
  margin-left: 5px;
  font-size: 30px;
  color: #1b1b1b;
}
.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
</style>




